FORMULARIOS

Los formularios nos permiten dentro de una página Web solicitar información al visitante y procesarla. En un formulario podremos solicitar diferentes datos (campos) cada uno de los cuales quedará asociado a una variable. Una vez se hallan introducido los valores en los campos, el contenido de estos será enviado a la dirección (URL) donde tengamos el programa que pueda procesar las variables. Para poder realizar este último paso de procesar las variables necesitaremos realizar un programa externo en algun lenguaje de programación como PERL, C++ o Visual Basic. A este programa externo se le suele llamar CGI (Common Gateway Interface). La creación de este tipo de programas sería tema de otro manual diferente, por lo que aquí veremos como se pueden enviar las variables a nuestra dirección de correo electrónico.

La declaración del formulario se pone entre las directivas <FORM></FORM>. En el interior de la declaración se indican los elementos (variables) de entrada. La directiva <FORM> tiene los parámetros action y method.


<FORM> Definici�n de formularios

     Existe una instrucci�n HTML para la creaci�n de formularios esta es FORM, que tiene la siguiente estructura:

< FORM ACTION="fichero que trata el formulario" METHOD= POST | GET >
...
Elementos que forman el formulario
...
< /FORM>

     Dentro de la etiqueta de formulario se definir�n los distintos elementos de petici�n de datos. Estas instrucciones que se explicar�n a continuaci�n definir�n los tipos de botones, cajas de dialogo y ventanas para la introducci�n de datos. Y definir�n las variables que almacenar�n los datos introducidos por el usuario. Estas etiquetas se incluir�n entre la de definici�n del formulario y la etiqueta de final de formulario.

     Los atributos que presenta la etiqueta FORM son los siguientes:

ACTION:

     Indica el programa que se encargar� de tratar los datos del formulario. Este programa debe encontrarse en el servidor y estar escrito en alg�n lenguaje de programaci�n. A este programa se pasar� como par�metros los datos introducidos en el formulario y retornar� un c�digo HTML que se mostrar� tras procesar el formulario. A este tipo de programas se les llama cgi-bin, y se explican en el �ltimo apartado de este manual: (CGI-BIN).

METHOD:

     Indica el protocolo usado para el env�o de los datos. Con POST env�a los datos en la entrada est�ndar del programa que trata el formulario y con GET los datos se pasan por par�metro, en la l�nea de comandos, al programa. El usar uno o otro m�todo vendr� determinado por como son tratados los par�metros en el formulario en el (CGI-BIN). El m�todo de uso m�s normal ser� POST.


     Una vez definidas las caracter�sticas globales del formulario incluiremos los distintos botones y cajas de dialogo que lo constituyen. Dentro de la instrucci�n del formulario podr�n incluirse cualquier texto o instrucci�n HTML, siendo recomendado a fin de poder etiquetar las opciones de entrada y especificar cualquier dato importante relacionado con el formulario. Igualmente un formulario puede ser incluido en algunas instrucciones HTML como las listas, tablas, etc ...

<INPUT> Entrada b�sica de datos

     La etiqueta INPUT se utiliza para definir gran variedad de tipos de campos de entrada de datos. Por lo general ser�n entradas de texto corto (a lo sumo una frase) o opciones. El formato b�sico es el siguiente:

< INPUT TYPE = ( TEXT | PASSWORD | CHECKBOX | RADIO | HIDDEN | SUBMIT | IMAGE | RESET ) NAME = "Variable que toma el valor" VALUE = "Valor de Inicializaci�n" >

     El atributo TYPE se usa para determinar el tipo de recuadro de dialogo de entrada que se est� definiendo, a continuaci�n se explicar�n por separado cada una de las opciones. El atributo NAME especifica el nombre de la variable que se define. Este nombre ser� pasado al programa que trata el formulario junto con el valor que le asigno el usuario del formulario. El atributo VALUE suele especificar el valor de inicializaci�n, que ser� el valor por defecto.

     A continuaci�n se relatan los distintos tipos de instrucciones de entrada.

<INPUT TYPE=TEXT...> Texto corto

     Se utiliza para la entrada de cadenas de texto corto, como por ejemplo nombre de personas, n�meros, fechas o diversos datos que se puedan expresar en una l�nea de texto.

     Se mostrar� un recuadro que ocupa una l�nea y la que ser� posible especificar este texto. El formato de la instrucci�n es el siguiente:

< INPUT TYPE=TEXT NAME="variable" VALUE="valor inicial" SIZE="tama�o" MAXLENGTH="longitud m�xima" >

     El tama�o de la ventana de introducci�n de texto se fija con el atributo SIZE, que indica el tama�o de la ventana en caracteres. Aqu� solo se define la parte visible, pero el usuario podr� introducir m�s texto si lo desea. Para indicar el m�ximo n�mero de caracteres que se permiten en la entrada usaremos: MAXLENGTH. El atributo NAME indica el nombre de la variable que toma el valor de la entrada y VALUE especifica el valor de inicializaci�n del campo. De todos los atributos solo ser� obligatorio NAME, siendo el resto opcionales. En la entrada se podr�n usar cualquier tipo de caracteres incluso los acentuados, en su formato normal.

Ejemplos
Inst.
HTML
Nombre: <INPUT TYPE=TEXT NAME=variable>
Resul
tado
Nombre:
Explica
ci�n
Ser� una introducci�n de texto b�sica.
Inst.
HTML
Nombre: <INPUT TYPE=TEXT NAME=variable VALUE="Texto de Inicializaci�n">
Resul
tado
Nombre:
Explica
ci�n
En este caso introduciremos un texto de inicializaci�n que ser� el texto por defecto y es editable por el usuario.
Inst.
HTML
Nombre: <INPUT TYPE=TEXT NAME=variable VALUE="Texto de Inicializaci�n" SIZE=10 MAXLENGHT=15>
Resul
tado
Nombre:
Explica
ci�n
Ahora definimos con SIZE un mayor tama�o del recuadro y con MAXLENGHT definimos el n�mero m�ximo de caracteres que se pueden introducir.

<INPUT TYPE=PASSWORD...> Palabras secretas

     Es similar al anterior pero en este caso no se imprimen los caracteres seg�n se van introduciendo, se muestra un asterisco en vez de los caracteres. Solo se puede ver el n�mero de caracteres, pero no valor. Se usa para la introducci�n de claves de acceso (passwords) y datos que no deban ser vistos al introducirlos. El formato es:

< INPUT TYPE=PASSWORD NAME="variable" VALUE="valor inicial" SIZE="tama�o" MAXLENGTH="li>longitud m�xima" >

Ejemplo
Inst.
HTML
Password: <INPUT TYPE=PASSWORD NAME=variable VALUE="password">
Resul
tado
Password:
Explica
ci�n
El texto introducido no puede ser visto, pero si es posible saber el n�mero de caracteres que se introducen.

<INPUT TYPE=CHECKBOX> Botones de selecci�n

     El checkbox es un bot�n que puede presentar dos estados activado o desactivado. El formato es el siguiente:

< INPUT TYPE=CHECKBOX NAME="variable" CHECKED>

     Se requiere el atributo NAME. Los valores que tomar� la variable ser�n on � off, dependiendo de su estado. Si el bot�n estaba activado cuando se env�an los datos del formulario se enviaran el nombre de la variable y el valor que indique su estado. Si se incluye el atributo CHECKED el bot�n se encontrar� activado en la inicializaci�n.
Si se indica el atributo VALUE,cuando se envian los datos con el bot�n activado se mandar� la variable con el valor indicado y en caso contrario no se mandar� ning�n valor.

Ejemplo
Inst.
HTML
<INPUT TYPE=CHECKBOX NAME= variable> Opci�n
Resul
tado
Opci�n
Explica
ci�n
En este caso esta desactivado por defecto y su utilizar� en caso de los valores on y off para definir su estado.
Inst.
HTML
<INPUT TYPE=CHECKBOX NAME= variable CHECKED> Opci�n
Resul
tado
Opci�n
Explica
ci�n
Ahora se especifica CHECKED para indicar que por defecto debe estar activado.

<INPUT TYPE=RADIO...> Selecci�n entre m�ltiples opciones

     Se usa cuando la opci�n puede tomar un valor simple de una serie de alternativas. En este caso se presentan unos valores opcionales de los que solo puede tomar un valor. Para especificar cada uno de estos valores se incluir� una etiqueta RADIO por cada una de las posibles alternativas, su estructura general ser�:

< INPUT TYPE=RADIO NAME="variable" VALUE="valor 1" CHECKED >